{extend name="public/audit" /}
{block name='body'}
<div style="background: white">
    <div class="layui-btn-group">
        <button class="layui-btn" id="addCat">新增分类</button>
    </div>
    <table class="layui-hide" id="listCat" lay-filter="cats"></table>
</div>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-xs" lay-event="disable">禁用</a>
    <a class="layui-btn layui-btn-xs" lay-event="able">启用</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script type="text/html" id="iconTel">
    <img src="__PUBLIC__/{{d.Icon }}" width="25px" height="25px;" alt="">
</script>

<script>

    layui.config(
        {
            base: "__JS__/"
        }
    ).use(['res', 'table', 'layer', 'jquery'], function ()
    {
        let table = layui.table, layer = layui.layer, $ = layui.jquery;//表格
        let res = layui.res, response = layui.res;

        //执行一个 table 实例
        table.render({
            elem: '#listCat'
            , height: 470
            , url: "{:url('audit/listCatApi')}" //数据接口
            , page: true//开启分页
            , cellMinWidth: 100
            , response: res.responseFields
            , cols: [[
                {type: 'numbers'}
//                ,{type: 'checkbox'}
                , {field: 'PK_ResourceCategoryGuid', title: 'ID', unresize: true, sort: true, width: 88}
                , {field: 'Name', title: '分类名称'}
                , {field: 'Icon', title: '图标', style: 'height:25px;', templet: '#iconTel', align: 'cenger', width: 60}
                , {field: 'CreateTime', title: '创建时间', sort: true, width: 150}
                , {field: 'UpdateTime', title: '最后修改时间', sort: true, width: 150}
                , {field: 'DeleteTime', title: '删除时间', sort: true, width: 150}
                , {field: 'Status', title: '状态', width: 110, templet: '#checkboxTpl', unresize: true}
                , {title: '操作', fixed: 'right', width: 200, align: 'center', toolbar: '#barDemo'}
            ]]
        });


        table.on('tool(cats)', function (obj)
        { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            let data = obj.data; //获得当前行数据
            let layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            let tr = obj.tr; //获得当前行 tr 的DOM对象

            if (layEvent === 'del')
            { //删除
                layer.confirm('真的删除行么', function (index)
                {
                    res.delete("{:url('audit/delCatApi')}?guid=" + data.PK_ResourceCategoryGuid);
                    obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                    layer.close(index);

                    //向服务端发送删除指令
                });
            } else if (layEvent === 'edit')
            { //编辑
                layer.open(
                    {
                        type: 2,
                        title: "修改分类",
                        area: ['415px', "666px"],
                        closeBtn: 0,
                        shadeClose: true,
                        skin: "",
                        content: "{:url('audit/addCat')}?guid=" + data.PK_ResourceCategoryGuid
                    }
                );
                //同步更新缓存对应的值
                obj.update({
                    Name: '请刷新后查看'
                    , Icon: '请刷新后查看'
                });
            } else if (layEvent === 'able')
            {
                $.get("{:url('audit/ableCatApi')}?guid=" + data.PK_ResourceCategoryGuid, function (res)
                {
                    if(res.errno===0){
                        obj.update({
                            Status: '启用'
                        });
                    }

                    return response.modify(res);
                })
            } else if (layEvent === 'disable')
            {

                $.get("{:url('audit/disableCatApi')}?guid=" + data.PK_ResourceCategoryGuid, function (res)
                {
                    if(res.errno===0){
                        obj.update({
                            Status: '禁用'
                        });
                    }

                    return response.modify(res);
                })

            }
        });

        $('#addCat').click(function ()
        {
            layer.open(
                {
                    type: 2,
                    title: "添加分类",
                    area: ['415px', "666px"],
                    closeBtn: 0,
                    shadeClose: true,
                    skin: "",
                    content: "{:url('audit/addCat')}"

                }
            )
        })
    });
</script>
{/block}
